{extend name="layout:base" /}
{block name="page_style"}
  <link href="{$site_root}/static/blonkon1.0.4/global/plugins/bower_components/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css" rel="stylesheet">
  <link href="{$site_root}/static/blonkon1.0.4/global/plugins/bower_components/bootstrap-tagsinput/dist/bootstrap-tagsinput.css" rel="stylesheet">
{/block}
{block name="main_content"}
  <div class="panel panel-tab rounded shadow">
    <!-- Start tabs heading -->
    <div class="panel-heading no-padding">
      <ul class="nav nav-tabs" id="topNavTab">
        <li>
          <a class="page-nav" href="{:url('personal')}">
            <i class="fa fa-th"></i>
            <div>
              <span class="text-strong">新闻列表</span>
            </div>
          </a>
        </li>
        <li class="active">
          <a class="page-nav" href="#tab1-1" data-toggle="tab">
            
            {empty name="article.id"}
              <i class="fa fa-plus"></i>
              <div>
                <span class="text-strong">添加新闻</span>
              </div>
            {else /}
              <i class="fa fa-edit"></i>
              <div>
                <span class="text-strong">编辑新闻</span>
              </div>
            {/empty}
          </a>
        </li>
      </ul>
    </div><!-- /.panel-heading -->
    <!--/ End tabs heading -->

    <!-- Start tabs content -->
    <div class="panel-body">
      <div class="tab-pane fade in active inner-all" id="tab1-1">
        <div class="row">
          <div class="col-xs-12 col-sm-12">
            <form id="model-form" method="post" action="" class="form-horizontal form-bordered">
              <div class="form-body">
                <div class="form-group">
                  <label class="col-md-2 col-sm-3 col-xs-4 control-label">
                    所属分类：
                  </label>
                  <div class="col-sm-9 col-xs-8">
                    <select name="category_id"  class="form-control" required>
                      {volist name="note_categories" id="vo"}
                        <option value="{$vo.id}"  <?php if(isset($article["category_id"]) && $article["category_id"]==$vo["id"]){echo('selected="selected"');} ?>>{$vo.title}</option>
                      {/volist}
                    </select>
                  </div>
                </div><!-- /.form-group -->

                <div class="form-group">
                  <label class="col-md-2 col-sm-3 col-xs-4 control-label">
                    新闻标题：
                  </label>
                  <div class="col-sm-9 col-xs-8">
                    <input class="form-control" type="text" name="title" placeholder="请输入分类标题" class="col-xs-10 col-sm-5" value="{$article.title|default=''}" required/>
                  </div>
                </div><!-- /.form-group -->

                <div class="form-group">
                  <label class="col-md-2 col-sm-3 col-xs-4 control-label">
                    封面图片：
                  </label>
                  <div class="col-sm-9 col-xs-8">
                    {:upload_image_id("wap_cover_id", 100, 100, $article['wap_cover_id'])}
                  </div>
                </div><!-- /.form-group -->

                <div class="form-group">
                  <label class="col-md-2 col-sm-3 col-xs-4 control-label">
                    正文：
                  </label>
                  <div class="col-sm-9 col-xs-8">
                    <script id="content" name="content" type="text/plain" style="width:100%;height:400px;">{$article.content|default=''}</script>
                  </div>
                </div><!-- /.form-group -->

                <div class="form-group">
                  <label class="col-md-2 col-sm-3 col-xs-4 control-label">
                    新闻标签：
                  </label>
                  <div class="col-sm-9 col-xs-8">
                    <input type="text" value="{$tag_names}" name="tag_names" data-role="tagsinput" placeholder="请输入新闻的标签"/>
                  </div>
                </div><!-- /.form-group -->

                <div class="form-group">
                  <label class="col-md-2 col-sm-3 col-xs-4 control-label">
                    是否原创：
                  </label>
                  <div class="col-sm-9 col-xs-8">
                    <input type="checkbox" value="1" class="switch" id="is_origin" name="is_origin" <?php if(isset($article["is_origin"]) && intval($article["is_origin"])){echo('checked="checked"');} ?> data-on-text="是" data-off-text="否" data-on-color="success">
                  </div>
                </div><!-- /.form-group -->

                <div class="form-group">
                  <label class="col-md-2 col-sm-3 col-xs-4 control-label">
                    信息来源：
                  </label>
                  <div class="col-sm-9 col-xs-8">
                    <input class="form-control" type="text" id="origin_author" name="origin_author" placeholder="请填写内容来源" class="col-xs-10 col-sm-5" value="{$article.origin_author|default=''}" <?php if(isset($article["is_origin"]) && intval($article["is_origin"])){echo('disabled="disabled"');} ?> />
                  </div>
                </div><!-- /.form-group -->

                <div class="form-group">
                  <label class="col-md-2 col-sm-3 col-xs-4 control-label">
                    显示状态：
                  </label>
                  <div class="col-sm-9 col-xs-8">
                    <input type="checkbox" value="1" id="status" class="switch" name="status" <?php if(isset($article["status"]) && intval($article["status"])){echo('checked="checked"');} ?> data-on-text="发布" data-off-text="草稿" data-on-color="success">
                  </div>
                </div><!-- /.form-group -->
              </div><!-- /.form-body -->
              <div class="form-footer">
                <div class="text-center">
                  {notempty name="article.id"}
                    <input type="hidden" name="id" value="{$article.id}">
                  {/notempty}
                  <button class="btn btn-success mr-5" type="submit">保存</button>
                  <a href="" class="btn btn-danger">取消</a>
                </div>
                <div class="clearfix"></div>
              </div><!-- /.form-footer -->
            </form>
          </div>
        </div>
      </div>
    </div><!-- /.panel-body -->
    <!--/ End tabs content -->
    <!--/ End pager -->
  </div><!-- /.panel -->
{/block}
{block name="page_js"}
  <script src="{$site_root}/static/plugins/jquery-validate/jquery.validate.min.js"></script>
  <script src="{$site_root}/static/blonkon1.0.4/global/plugins/bower_components/bootstrap-switch/dist/js/bootstrap-switch.min.js"></script>
  <script src="{$site_root}/static/blonkon1.0.4/global/plugins/bower_components/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js"></script>
  <script src="{$site_root}/static/plugins/ueditor/ueditor.config.js" type="text/javascript"></script>
  <script src="{$site_root}/static/plugins/ueditor/ueditor.all.min.js?v=20170615" type="text/javascript"></script>
  <script src="{$site_root}/static/plugins/ueditor/lang/zh-cn/zh-cn.js" type="text/javascript"></script>
  <script type="text/javascript">
    // var um = UM.getEditor("content", {
    //             imageUrl: "{:url('index/upload/umeditor')}", //把编辑器的图片上传方法改成TP方法
    //             imagePath: "", //
    //             toolbar: ['source | bold italic underline strikethrough | forecolor backcolor | removeformat |',
    //         'insertorderedlist insertunorderedlist | selectall cleardoc paragraph | fontfamily fontsize' ,
    //         '| justifyleft justifycenter justifyright justifyjustify |',
    //         'image horizontal fullscreen']
    //       });
    var ue = UE.getEditor('content', {
      // serverUrl: URL + "{:url('index/upload/umeditor')}",
      retainOnlyLabelPasted: true,  //粘贴只保留标签，去除标签所有属性
      pasteplain: true,
      autoHeightEnabled: false, //是否自动长高，默认true
      scaleEnabled: false, //是否可以拉伸长高，默认true(当开启时，自动长高失效)
      autoFloatEnabled: false, //是否保持toolbar的位置不动，默认true
      initialFrameHeight: 500,  //初始化编辑器高度，默认320
      imageScaleEnabled: false,  //启用图片拉伸缩放
      imagePopup: false, //图片操作的浮层开关，默认打开
      'lineheight':['1', '2', '2.5', '3', '4', '5'],
      toolbars: [[
          'source', '|', 'bold', 'italic', 'underline', 'strikethrough', '|', 'fontsize', 'forecolor', 'backcolor', '|', 'paragraph', 'removeformat','|', 'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', 'lineheight', '|',
          'insertimage', 'horizontal'
        ]]
      });

    var isOrigin = {$article.is_origin|default='1'};

    $.validator.addMethod("validOriginAuthor", function(value){
      if(parseInt(isOrigin) > 0){
        return true;
      }else{
        var strAuthor = $("#origin_author").val();
        console.log(strAuthor.length);
        if(strAuthor.length >= 2 && strAuthor.length <= 20){
          return true;
        }else{
          return false;
        }
      }
    }, "您输入有效的信息来源");

    jQuery(function($){
      if($('input.switch#status').length){
        $('input.switch#status').bootstrapSwitch();
      }

      $('input.switch#is_origin').bootstrapSwitch({  
        onSwitchChange:function(event,state){
          var $inputOriginAuthor = $("input#origin_author");
          if(state==true){
            $inputOriginAuthor.attr("disabled", "disabled");
          }else{
            $inputOriginAuthor.removeAttr("disabled");
          }  
        }  
      }); 

      $("form#model-form").validate({
        ignore: "",
        rules:{
          "category_id":{
            required: true
          }, "title":{
            required: true,
            minlength: 2,
            maxlength: 100
          }, "wap_cover_id":{
            min: 1
          }, "content":{
            required: true
          }, "origin_author":{
            validOriginAuthor: true
          }
        },
        messages:{
          "category_id":{
            required: "请选择新闻所属分类"
          }, "title":{
            required: "标题不能为空",
            minlength: "标题不能少于1个字符",
            maxlength: "标题不能超过100个字符"
          }, "wap_cover_id":{
            min: "请上传封面图片"
          }, "content":{
            maxlength: "请输入新闻正文"
          }
        },
        errorClass: "help-inline input-error",
        errorElement: "span",
        highlight:function(element, errorClass, validClass) {
          $(element).parents('.form-group').addClass('has-error');
        },
        unhighlight: function(element, errorClass, validClass) {
          $(element).parents('.form-group').removeClass('has-error');
        },
        submitHandler: function(form){
          var $form = $(form);
          $.ajax({
            url: $form.attr("action"),
            type: $form.attr("method"),
            dataType: "JSON",
            data: $form.serialize(),
            success: function(data){
              if(data.code){
                location.href = data["url"];
              }else{
                alert(data["msg"]);
              }
            }, error: function () {
              alert("数据执行错误！");
            }
          });
        }
      });

    });
  </script>
{/block}